<template>
    <div :style="{color:'black',backgroundColor:'#F2F3F5'}">
        <div className="content">
            <div  class="st_1" v-for="(value1,key) in department">
                <div class="ed_2"> {{ key }}</div>
                <div class="th_3">
                    <div @click="go(el[0])" className="th_4" v-for="(el) in value1.value" @:click="getmsg(el[0])">
                        <!--  v-for="(el) in value1.value" -->
                        <img :src="el[1]" alt="" />
                        <div> {{ el[0] }} </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { toRefs} from "vue";
import store from "@/store/S_zc"

import { useRouter } from "vue-router";
let router=useRouter()

let department = toRefs(store().department_all)
let num = 712 / 3 + 'px'

function getmsg(x:string){
    // let path="/新页面"
    console.log("ask_doctor,vue router.push 参数  跳转页面",x)
}

function go(x:string){
    let txt='/as_k?department='+x
    router.push(txt)
}

</script>

<style scoped  lang="scss">
.content {
    width: 736px;
    padding: 0 16px;
    margin: 0 auto 10px;
    background-color: white;

    .st_1 {
        width: 736px;
        overflow: hidden;

        .ed_2 {
            font-size: 20px;
            line-height: 22px;
            margin-top: 20px;
            color: #333;
            font-weight: 500;
        }

        .th_3 {
            width: 748px;
            margin-top: 20px;
            display: flex;
            justify-content: flex-start;
            flex-wrap: wrap;
            overflow: hidden;

            .th_4 {
                width: v-bind(num);
                height: 62px;
                padding: 20px 0;
                margin: 0 12px 12px 0;
                border-radius: 5px;
                background-color: #fafafa;
                text-align: center;

                img{
                    width: 40px;
                    height: 40px;
                    margin-bottom: 6px;
                }

                div {
                    margin: 0 auto;
                    font-size: 14px;
                    font-weight: 500;
                    line-height: 16px;
                }
            }
        }
    }
}
</style>